<template>
  <div v-for="(item, key) in params_values_list" :key="key">
    {{ item.name }}
    <el-input v-model="item.value" />
  </div>
  审批人：
  <div v-for="(item, key) in examiner" :key="key">
    {{ item }}
  </div>
  <el-button @click="submit">提交</el-button>
</template>

<script setup>
  import { ref, onMounted } from "vue"
  import {useRoute, useRouter } from "vue-router";
  import http from "../http"

  const route = useRoute()
  const router = useRouter()

  let id = route.query.id

  let params_list = ref([])

  let params_values_list = ref([])

  let examiner = ref([])

  // 获取参数列表
  const getparamslist = () => {
    http.get(`http://127.0.0.1:8000/workflow/workflow_retrieve/${id}/`)
    .then(res=>{
      console.log(res)
      params_list.value = res.data.params
      // 重建params_values_list
      for(let i=0; i<params_list.value.length; i++){
        params_values_list.value.push({name: params_list.value[i].name, value: ""})
      }
      console.log(params_list.value)
    })
  }

  // 获取审核人列表
  const getexaminerlist = () => {
    http.get(`workflow/workflow_approval_node_list/?workflow_id=${id}`)
    .then(res=>{
      console.log(res)
      examiner.value = res.data.user_list
    })
    .catch(error=>{
      console.log(error)
    })
  }

  const submit = () => {
    http.post(`http://127.0.0.1:8000/workflow/task/`, {message: {params: params_values_list.value, workflow: id}})
    .then(res=>{
      console.log(res)
      if(res.data.code == 200){
        alert("提交成功")
      }
    })
    .catch(error=>{
      console.log(error)
    }
    )
  }


  onMounted(()=>{
    getparamslist()
    getexaminerlist()
  })

</script>
